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(54) Three-dimensional icons for graphical user interface 



(57) A strong three-dimensional icon is created for 
low-resolution displays such as used in portable com- 
munication devices by alternating light and dark stripes, 
with some stripes changing from light to dark and back 



to light to indicate a shadow, and other stripes from dark 
to light and back to dark to indicate a highlight. Altogeth- 
er, the light and dark stripes with shadows and highlights 
provide the icon with a strong three-dimensional ap- 
pearance. 




FIG. 1 



Printed by Jouve, 75001 PARIS (FR) 



BNSDOCID: <EP 1209651 A2 I > 



1 



EP1 209 651 A2 



2 



Description 

BACKGROUND OF THE INVENTION 

1 . Field of the Invention 

[0001] The invention relates to user interface graphics 
for mobile phones or other portable electronic devices 
with displays. 

2. Description of the Related Art 

[0002] For low-resolution displays of portable com- 
munication devices, images presented thereon have in 
the past had strong two-dimensional characteristics. It 
would be advantageous to add value to the display of 
images for such devices to give a more three-dimen- 
sional effect and thereby increase the impact of the im- 
agery presented. 

BRIEF SUMMARY OF THE INVENTION 

[0003] An object of the present invention is to make 
possible the presentation of low-resolution images with 
strong three-dimensional effect. 

[0004] According to a first aspect of the invention, a 
computer-readable medium encoded with a data struc- 
ture for use in providing a graphical icon for display on 
a display of a portable communications device is char- 
acterized in that said data structure is encoded as digital 
data indicative of said graphical icon defined by alter- 
nating light and dark stripes, that selected stripes of said 
light and dark stripes change from light to dark and back 
to light to indicate a shadow adjacent an edge of said 
icon and from dark to light and back to dark to indicate 
a highlight adjacent another edge of said icon, and that 
altogether said light and dark stripes with shadows and 
highlights provide said icon with a three-dimensional ap- 
pearance. 

[0005] According to a second aspect of the invention, 
a communication device comprises means responsive 
to an event in the communication device for providing 
an event signal, a computer readable medium encoded 
with a data structure for use in providing a graphical icon 
for display on a display of a portable communications 
device, wherein the data structure is encoded as digital 
data indicative of said graphical icon defined by alter- 
nating light and dark stripes, wherein selected stripes of 
said light stripes change from light to dark and back to 
light to indicate a shadow adjacent an edge of said icon 
and from dark to light and back to dark to indicate a high- 
light adjacent another edge of said icon, and that alto- 
gether said light and dark stripes with shadows and 
highlights provide said icon with a three-dimensional ap- 
pearance, and means responsive to the event signal for 
retrieving the digital data from the computer-readable 
medium and causing said display of said graphical icon 
on said display according to said retrieved digital data. 



[0006] According to a third aspect of the invention, a 
method of displaying an icon on a portable communica- 
tion device comprises the steps of retrieving, in re- 
sponse to an event signal, digital data from a computer- 
5 readable medium, and displaying said icon in response 
to said digital data retrieved from said computer-reada- 
ble medium, wherein said digital data is indicative of said 
icon defined by alternating light and dark stripes, that 
selected stripes of said light and dart stripes change 
from light to dark and back to light to indicate a shadow 
adjacent an edge of said icon and from dark to light and 
back to dark to indicate a highlight adjacent another 
edge of said icon, and that altogether said light and dark 
stripes with shadows and highlights provide said icon 
with a three-dimensional appearance. 
[0007] Further according to the first, second and third 
aspects of the invention, said digital data is encoded ac- 
cording to a portable bitmap file format. 
[0008] Still further according to the first, second and 
third aspects of the invention, said digital data is encod- 
ed according to a portable graymap file format. 
[0009] Further still according to the first, second and 
third aspects of the invention, said digital data is encod- 
ed according to a portable color image file format. 
[0010] These and other objects, features and advan- 
tages of the present invention will become more appar- 
ent in light of the detailed description of a best mode 
embodiment thereof, as illustrated in the accompanying 
drawing. 

BRIEF DESCRIPTION OF THE DRAWING 
[0011] 

Fig. 1 shows a mobile communication device, ac- 
cording to the present invention, with a graphical 
icon defined by alternating light and dark stripes. 
Fig. 2A shows an "outdoor" graphical icon, accord- 
ing to the present invention. 

Fig. 2B shows a "meeting" graphical icon, according 
to the present invention. 

Fig. 2C shows a "silent" graphical icon, according 
to the present invention. 

Fig. 2D shows a "footprint" graphical icon, accord- 
ing to the present invention. 
Fig. 2E shows a "butterfly" graphical icon, according 
to the present invention. 

Fig. 2F shows an enlarged view of Fig. 2E to better 
illustrate the alternating light and dark stripes, ac- 
cording to the present invention. 
Fig. 3 shows a portable communication device, ac- 
cording to the present device. 
Fig. 4 shows a series of steps which may be carried 
out in the device of Fig. 3, according to the present 
invention. 
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DETAILED DESCRIPTION OF THE INVENTION 

[001 2] Fig. 1 shows a communication device 1 0 In the 
form of a mobile station or wireless user terminal such 
as, but not limited to, a cellular radio telephone or per- 
sonal communicator that Is suitable for displaying an im- 
age 12, according to the present invention. The image 
12 is defined by alternating light and dark stripes, as 
shown. Selected stripes change from light to dark and 
back to light to indicate a shadow adjacent to an edge 
of a feature of the icon. Stripes also change from dark 
to light and back to dark to indicate a highlight adjacent 
another edge of a feature of the icon. Altogether, the 
light and dark stripes with shadows and highlights pro- 
vide the icon with a three-dimensional appearance, 
much like a bas-relief. 

[0013] The communication device 10 of Fig. 1 in- 
cludes a display 14, a keypad 16, a microphone 18 and 
a speaker 20. An antenna is located behind the speaker 
at the back of the device 10 and is not shown in Fig. 1 . 
The keypad 16 may be covered by a sliding cover 22 
when the keypad is not in use. 

[0014] It is noted from the icon 12 of Fig. 1 that the 
image there shown is of a graph, for instance of a stock 
price over time and has a strong three-dimensional ef- 
fect on the viewer which makes the image of the graph 
stand out more than it otherwise would if it had been 
rendered as a simple two-dimensional graph, as has 
been the case in the prior art. 

[0015] Some examples of such images will now be 
shown. For instance, Fig. 2A shows a scene of a city 
which can be used as an icon to symbolize an "outdoor" 
context for an application of the device 10. As can be 
seen, it is made up of vertical stripes that alternate be- 
tween light and dark. Selected stripes are interrupted 
and change from dark to light or vice versa and may 
change back again, although not necessarily. These 
changes from light to dark in a given stripe permit the 
designerto create effects of highlighting and shadowing 
on the displayed objects in order to suggest the pres- 
ence of an imaginary light source casting light from a 
given direction toward the objects. In Fig. 2 A, the imag- 
inary light source is coming from the upper left and 
therefore the highlighting occurs on the left-hand side 
of the buildings illustrated, while shadowing occurs on 
the right-hand side. 

[0016] Similarly, Fig. 2B shows a "meetings" icon 
which is also made up of vertical stripes alternating be- 
tween light and dark. Again, an imaginary light source 
to the upper left creates highlighting to the left and top 
of the illustrated briefcase, while shadowing occurs at 
the bottom and right-hand side thereof. A given vertical 
stripe may change from dark to light or light to dark and 
back again, or stay the same. 

[0017] Fig. 2C shows a "silent" in the form of a water 
lily with an imaginary light source coming from directly 
above. The outstretched leaves of the lily are highlighted 
at the top edges thereof and are shadowed underneath. 



Each "leaf can be thought of as a feature of an iconic 
representation of a water lily, which is made of alternat- 
ing light and dark vertical stripes, according to the 
present invention. 

s [001 8] Fig. 2D shows a "footprint" icon with alternating 
light and dark vertical stripes, according to the present 
invention. A given light or dark stripe can change from 
dark to light or light to dark and remain that way or 
change back to the original shade. The footprint is 

10 shown Illuminated from directly above by an imaginary 
light source, the same way as In Fig. 2C, with shadowing 
underneath. 

[0019] Fig. 2E shows a "butterfly" icon, again illumi- 
nated from above, and made up of alternating light and 

15 dark vertical stripes, according to the present invention. 
Fig. 2F shows an enlargement of Fig. 2E in order to bet- 
ter appreciate the changing of the vertical stripes. For 
instance, a first dark stripe 24 at the left edge stays dark 
throughout the full extent thereof. The same can be said 

20 for the second stripe, which is a light-shaded stripe that 
does not change throughout its extent. A third stripe 
which is dark shaded also does not change and remains 
dark throughout. A fourth stripe 30 is light colored for 
most of its extent, but includes a short dark portion near 

25 the top and which Indicates a shadow adjacent an edge 
of the icon of the butterfly, i.e., a shadow under the tip 
of its left wing. The light-shaded vertical stripe 30 starts 
out as light shaded and then changes to dark shaded 
and changes back again to light shaded. A next stripe 

30 32 is dark shaded for most of its extent, but has a short 
part near the top that is used to indicate a highlight at 
the top tip of the left wing of the butterfly icon. This is an 
instance of a dark-shaded stripe changing from dark to 
light and back to dark again to indicate a highlight adja- 

35 cent another edge of the icon of the butterfly. Altogether, 
these alternating light and dark stripes with parts indi- 
cating shadows and highlights provide the icon with a 
strong three-dimensional appearance. 
[0020] All of these icons resemble scupttural reliefs In . 

40 which the projection from the surrounding surface is 
slight and no part of the modeled form is undercut. 
[0021] Fig. 3 shows the communication device of Fig. 
1 as schematic block diagram. The previously-men- 
tioned display, keypad, microphone and speaker are 

45 shown to the right of Fig. 3. They are connected to an 
input/output (I/O) port 34 of a signal processor 36 which 
is inside of the device 10. The I/O device is also con- 
nected to the previously-mentioned antenna 38 through 
a receiver 40 and demodulator 42, as well as a modu- 

50 lator 44 and transmitter 46. 

[0022] The signal processor 36 includes a central 
processing unit (CPU) 48 connected to a data, address 
and control bus 50 which is also connected to a random 
access memory (RAM) 52 and a computer-readable 

55 medium 54, which may be a read-only memory (ROM), 
miniature hard drive, or other device capable of saving 
encoded digital data. 

[0023] The digital data stored in the computer-reada- 
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ble medium 54 may include a computer program such 
as shown in Fig. 4 for displaying three-dimensional 
icons according to the present invention, such as those 
shown in Figs. 2A-2F. Such a program can take the form 
shown in Fig. 4, but not necessarily. It can take other 
forms which would be equally valid for retrieving digital 
data representative of three-dimensional icons, accord- 
ing to the present invention. In any event, after entering 
in a step 56, a decision is made in a step 58 as to wheth- 
er or not the signal processor 36 has received or has 
detected an event which would call for the display of a 
three-dimensional icon according to the present inven- 
tion. Such an event might be an internal event within the 
signal processor or may be an external event, such as 
the depression of a button on the keypad or the recep- 
tio n of a signal over the antenna 38, or some other event 
or combination thereof. If not, the step is re-executed 
indefinitely. Such a program can be running in back- 
ground in conjunction with other processes being exe- 
cuted in a multiprocessing environment or can be exited 
and returned to periodically. If such an event is detected, 
a step 60 is executed to retrieve digital data stored in 
the computer-readable medium 54 indicative of a three- 
dimensional icon according to the present invention. 
The signal processor 36 then causes the retrieved dig- 
ital data to be displayed on the display 14, as indicated 
by a step 62, e.g., by a graphics controller. A return is 
then made in a step 64 for further processing. 
[0024] The computer-readable medium is encoded 
with a data structure for use in providing the three-di- 
mensional graphical icon of the present invention. The 
data structure is encoded as digital data indicative of the 
graphical icon defined by alternating light and dark 
stripes. Selected stripes of the light and dark stripes 
change from light to dark. They may also change back 
to light again to indicate a shadow adjacent an edge of 
the icon. Stripes may also change from dark to light and 
stay that way or change back again to dark to indicate 
a highlight adjacent another edge of the icon. Altogether, 
the light and dark stripes with shadows and highlights 
provide the icon with a strong three-dimensional ap- 
pearance. 

[0025] The data structure stored in the computer- 
readable medium may be encoded according to a port- 
able bitmap file format known in the art as "pbm". It is a 
lowest common denominator monochrome file format. 
Alternately, the structure can be encoded with other for- 
mats, such as "pgm" for portable graymap file format, or 
"ppm" for portable pixmap file format (lowest common 
denominator color image file format). 
[0026] Although the invention has been shown and 
described with respect to a best mode embodiment 
thereof, it should be understood by those skilled in the 
art that the foregoing and various other changes, omis- 
sions and additions in the form and detail thereof may 
be made therein without departing from the spirit and 
scope of the invention. 



Claims 

1 . A computer-readable medium encoded with a data 
structure for use in providing a graphical icon f or dis- 

s play on a display of a portable communications de- 
vice, characterized in that said data structure is 
encoded as digital data indicative of said graphical 
icon defined by alternating light and dark stripes, 
that selected stripes of said light and dark stripes 

10 change from light to dark and back to light to indi- 
cate a shadow adjacent an edge of said icon and 
from dark to light and back to dark to indicate a high- 
light adjacent another edge of said icon, and that 
altogether said light and dark stripes with shadows 

15 and highlights provide said icon with a three-dimen- 
sional appearance. 

2. The computer-readable medium of claim 1 , char- 
acterized in that said data structu re is encoded ac- 

20 cording to a portable bitmap file format. 

3. The computer-readable medium of claim 1 , char- 
acterized in that said data structure is encoded ac- 
cording to a portable graymap file format. 

25 

4. The computer-readable medium of claim 1 , char- 
acterized in that said data structure is encoded ac- 
cording to a portable color image file format. 

30 5. A communication device, comprising: . 

means, responsive to an event in the commu- 
nication device, for providing an event signal; 
a computer-readable medium encoded with a 

35 data structure for use in providing a graphical 

icon for display on a display of a portable com- 
munications device, wherein said data struc- 
ture is encoded as digital data indicative of said 
graphical icon defined by alternating light and 

40 dark stripes, that selected stripes of said light 

and dark stripes change from light to dark and 
back to light to indicate a shadow adjacent an 
edge of said icon and from dark to light and 
back to dark to indicate a highlight adjacent an- 

45 other edge of said icon, and that altogether said 

light and dark stripes with shadows and high- 
lights provide said icon with a three-dimension- 
al appearance; and 

means, responsive to the event signal, for re- 
50 trieving the digital data from the computer- 

readable medium and causing said display of 
said graphical icon on said display according to 
said retrieved digital data. 

55 6. The device of claim 5, wherein said data is encoded 
according to a portable bitmap file format. 

7. The computer-readable medium of claim 5, char- 
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acterized in that said data structure is encoded ac- 
cording to a portable graymap file format. 

8. The computer-readable medium of claim 5, char- 
acterized in that said data structure is encoded ac- s 
cording to a portable color image file format. 

9. Method of displaying an icon on a portable commu- 
nication device, comprising the steps of: 

retrieving, in response to an event signal, digital 
data from a computer-readable medium, 
wherein said digital data is indicative of said 
icon defined by alternating light and dark 
stripes, that selected stripes of said light and 
dark stripes change from light to dark and back 
. to light to indicate a shadow adjacent an edge 
of said icon and from dark to light and back to 
dark to indicate a highlight adjacent another 
edge of said icon, and that altogether said light 
and dark stripes with shadows and highlights 
provide said icon with a three-dimensional ap- 
pearance; and 

displaying said icon in response to said digital 
data. 

10. The method of claim 9, wherein said digital data is 
encoded according to a portable bitmap file format. 

11. The method of claim 9, wherein said digital data is 30 
encoded according to a portable graymap file for- 
mat. 

12. The method of claim 9, wherein said digital data is 
encoded according to a portable color image file for- 35 
mat. 
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(54) Three-dimensional icons for graphical user interface 



(57) A strong three-dimensional icon is created for 
low-resolution displays such as used In portable com- 
munication devices by alternating light and dark stripes, 
with some stripes changing from light to dark and back 



to light to indicate a shadow, and other stripes from dark 
to light and back to dark to indicate a highlight. Altogeth- 
er, the light and dark stripes with shadows and highlights 
provide the icon with a strong three-dimensional ap- 
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